/**
 * @author 木人心
 * @version 1.1.0
 */
@use 'config';

// types
$types: primary, success, warning, danger, error, info;

// region TODO 【Tree】 树
.el-tree {
  .el-tree-node__expand-icon {
    font-size: var(--el-tree-icon-font-size);
  }

  .el-tree-node__content {
    height: var(--el-tree-content-height);
  }

  &.el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content {
    background-color: var(--el-tree-highlight-current-color);
  }
}
// endregion

// region TODO 【Table】 表格
.el-table {
  .el-table__header {
    // 合并表头处理
    thead.is-group th.el-table__cell, .el-table-fixed-column--right {
      background-color: var(--el-table-header-bg-color) !important;
    }
  }
  tr{
    height: var(--el-table-header-height);
  }
}

// TODO 间隔行 class: el-c-table--spacing
.el-table.el-c-table--spacing {
  &:before {
    height: 0;
  }

  .el-table__body-wrapper table {
    border-collapse: separate;
    //border-spacing: 0 var(--el-table--spacing-size);
  }

  th.el-table__cell.is-leaf, td.el-table__cell {
    border-bottom: unset !important;
  }

  &.el-table--border {
    border: unset;

    .el-table__cell {
      border-right: unset;
    }
  }
}

// TODO 斑纹(隔行变色) stripe: true
.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell {
  background: var(--el-table--striped-background);
}

.el-table .el-table__row.el-c-highlight-row td.el-table__cell {
  animation: el-c-highlight-row 1s ease-in infinite alternate;
}
@keyframes el-c-highlight-row {
  from{
    background: var(--yk-color-primary-alpha-1);
  }
  to{
    background: var(--yk-color-primary-alpha-3);
  }
}
// endregion

// region TODO 【Tag】 标签
.el-tag--plain {
  --el-tag-bg-color: transparent!important;
}
// endregion

// region TODO 【Form】 表单
.el-form--inline .el-form-item {
  margin-right: 16px;
}
// TODO 不校验内部的input__wrapper class: .el-c-not-verify__input
.el-form-item.el-c-not-verify__input.is-error {
  .el-input__wrapper {
    box-shadow: inset 0 0 0 1px var(--el-input-border-color);
  }
  .el-input.is-error .el-input__wrapper {
    box-shadow: inset 0 0 0 1px var(--el-color-danger);
  }
}
// endregion

// region TODO 【Badge】 徽章
.el-badge__content {
  border: unset;
}
// endregion

// region TODO 【Divider】 分割线
.el-divider--horizontal {
  margin: unset;
  border-top: 1px var(--yk-color-divider) var(--el-border-style)
}
// endregion

// region TODO 【Tabs】 标签页
.el-tabs {
  .el-tabs__nav-wrap::after {
    background: var(--yk-color-divider);
  }
}

// TODO 默认（无滑轨）class: c_tabs-default
.el-tabs.c_tabs-default {
  .el-tabs__active-bar {
    height: 4px;
    border-radius: 2px;
  }
  .el-tabs__nav-wrap::after {
    height: 0;
  }
}
// endregion

// region TODO 【Checkbox】复选框
.el-checkbox.el-checkbox--large {
  font-size: 14px;
  .el-checkbox__label {
    font-size: inherit;
  }
}

// endregion

// region TODO 【Tag】标签
@each $type in $types {
  @if $type == "primary" {
    .el-tag {
      --el-tag-border-color: var(--el-color-#{$type});
    }
  } @else {
    .el-tag.el-tag--#{$type} {
      --el-tag-border-color: var(--el-color-#{$type});
    }
  }
}
// endregion

// region TODO 【Dialog】 对话框
.el-dialog {
  .el-dialog__header {
    border-bottom: 1px solid var(--yk-color-divider);
  }
}
// endregion

// region TODO 【Button】 按钮
.el-button.is-plain {
  --el-button-bg-color: transparent;
}

// endregion

// region TODO 【InputNumber】 计数器
.el-input-number {
  text-align: center;
  .el-input__wrapper {
    text-align: inherit;
    .el-input__inner {
      text-align: inherit;
    }
  }
}
// TODO 朴素计数器 class: el-c-input-plain
.el-input-number.el-c-input-plain {
  .el-input-number__increase, .el-input-number__decrease {
    background: none;
    border-width: 0 !important;
  }
}

// TODO 纯净计数器 class: el-c-input-pure
.el-input-number.el-c-input-pure {
  .el-input-number__increase, .el-input-number__decrease {
    background: none;
    display: none;
    border-width: 0 !important;
  }
  .el-input__wrapper {
    padding-left: 12px;
    padding-right: 12px;
  }
}

// endregion

// region TODO 【DateEditor】 日期选择器
.el-date-editor {
  &.el-date-editor--daterange {
    width: 240px;
  }
  &.el-date-editor--datetimerange {
    width: 360px;
    flex-grow: unset;
  }
}
// endregion

// region TODO 【Link】 超链接
.el-link {
  vertical-align: unset;
}
// endregion

// region TODO 【Descriptions】 描述
.el-descriptions {
  .el-descriptions__label{
    color: var(--yk-color-secondary);
    min-width: 100px;
    text-align: right;
    display: inline-block;
    margin-right: 8px;
  }
}
// endregion

// region TODO 【NProgress】 页面加载进度条
#nprogress {
  .bar {
    background: linear-gradient(to right, #1570BB, #00e1ff) !important;
    height: 3px;
    border-radius: 0 3px 3px 0;
  }
  .spinner {
    display: none;
  }
}
// endregion
